import {convertLetterToNumber, getRangeArrAllKeys, toLetters} from "@/zpkgs/components/z-data-grid/utils";

function calNewPos(firstColumnIndex, firstRowIndex, lastColumnIndex, lastRowIndex, obj) {
  let key = toLetters(firstColumnIndex) + '' + firstRowIndex
  let lastKey = toLetters(lastColumnIndex) + '' + lastRowIndex
  let arr = getRangeArrAllKeys(key, lastKey)
  let secondArr = arr

  let findedlastColumnIndex = lastColumnIndex
  let findedlastRowIndex = lastRowIndex
  let findedfirstColumnIndex = firstColumnIndex
  let findedfirstRowIndex = firstRowIndex

  let needed  = false
  arr.forEach(item => {
    if (obj[item]) {
      if (obj[item].lastColumnIndex > lastColumnIndex) {
        findedlastColumnIndex = obj[item].lastColumnIndex
        needed = true
      }
      if (obj[item].lastRowIndex > lastRowIndex) {
        findedlastRowIndex = obj[item].lastRowIndex
        needed = true
      }
      if (obj[item].firstColumnIndex < firstColumnIndex) {
        findedfirstColumnIndex = obj[item].firstColumnIndex
        needed = true
      }
      if (obj[item].firstRowIndex < firstRowIndex) {
        findedfirstRowIndex = obj[item].firstRowIndex
        needed = true
      }

      secondArr = ZY.lodash.uniq(secondArr.concat(obj[item].def.ext.arr))
    }
  })
  return [findedlastColumnIndex, findedlastRowIndex, findedfirstRowIndex, findedfirstColumnIndex, needed, secondArr, key, lastKey]
}

function deepCal(lastColumnIndex, lastRowIndex, firstColumnIndex, firstRowIndex, obj) {

  let [findedlastColumnIndex, findedlastRowIndex, findedfirstRowIndex, findedfirstColumnIndex, needed, secondArr, key, lastKey] = calNewPos(firstColumnIndex, firstRowIndex, lastColumnIndex, lastRowIndex, obj)


  if (needed) {
    console.log('need', secondArr)

    return deepCal(findedlastColumnIndex, findedlastRowIndex, findedfirstColumnIndex, findedfirstRowIndex, obj)
  } else {

    return [lastKey, key]
  }
}

export let SelectMixin = function () {
  let p_isSelect = false
  let p_isClick = true
  let firstPos
  let lastPos
  let firstTarget
  let lastTarget
  let lastSelectArr = []
  let moveOverMap = new Map()

  return {
    data() {
      return {
        selectState: {
          areaId: ZY.rid(),
          areaStyle: {
            left: 0,
            top: 0,
            width: 0,
            height: 0
          },
          areaRange: []
        },
        isSelectRight: false
      }
    },
    created() {
      this.eventBus.on('resize', this.$_selectHandleReize);
    },
    beforeDestroy() {
      this.eventBus.off('resize', this.$_selectHandleReize);
    },
    methods: {
      $_selectHandleReize() {
        // console.log('$_selectHandleReize', lastSelectArr)
        this.$nextTick(() => {
          setTimeout(() => {
            if (Array.isArray(lastSelectArr) && lastSelectArr.length === 2) {
              this.resetAreaStyle(lastSelectArr)
            }
          }, 30)
        })
      },
      $__selectCls() {
        return {
          'select-def': 1,
          'select-right': this.isSelectRight
        }
      },

      $__selectGetPos(target) {
        let container = this.getContainer()
        let containerRect = container.querySelector('.z-table-grid-editor-content').getBoundingClientRect()
        let cellStyle = this.getFirstCellStyle()
        let borderRight = parseFloat(cellStyle.borderRight);
        let borderBottom = parseFloat(cellStyle.borderBottom);

        let rect = target.getBoundingClientRect();
        let top = rect.top - containerRect.top - (borderBottom < 1 ? 1 : borderBottom);
        let left = rect.left - containerRect.left - (borderRight < 1 ? 1 : borderRight);
        let width = rect.width
        let height = rect.height
        let lastLeft = (left + width)
        let lastBottom = (top + height)
        return {
          left, top, width: rect.width, height: rect.height, lastLeft, lastBottom
        }
      },
      $__sizeAreaStyle(firstPos) {
        this.selectState.areaStyle.left = firstPos.left + 'px'
        this.selectState.areaStyle.top = firstPos.top + 'px'
        this.selectState.areaStyle.width = firstPos.width + 'px'
        this.selectState.areaStyle.height = firstPos.height + 'px'
      },
      selectHandleCellMouseDown() {
        if (p_isClick) {
          // this.p_isSelect = true
          p_isSelect = true
        }

        // console.log('sdsdsds', p_isClick)

      },

      selectHandleCellMouseMove(e) {

        let self = this
        let obj = self.state.obj

        let firstPosLeft = 0;
        let firstPosTop = 0;
        let lastRowIndex = 0;
        let lastColumnIndex = 0
        this.$nextTick(() => {
          // console.log('eeeee', p_isSelect)
          if (p_isSelect && firstPos) {
            firstPosLeft = firstPos.left;
            firstPosTop = firstPos.top;

            lastPos = this.$__selectGetPos(e.target)
            lastTarget = e.target
            moveOverMap.set(e.target.dataset.lastKey, e.target)

            moveOverMap.forEach((target, key)  => {

              let dataset = target.dataset
              if (dataset.rowNum > lastRowIndex) {
                lastRowIndex = parseInt(dataset.rowNum)
              }
              if (dataset.columnNum > lastColumnIndex) {
                lastColumnIndex = parseInt(dataset.columnNum)
              }
            })

            let key = firstTarget.dataset.key
            let firstColumnIndex = convertLetterToNumber(key.slice(0,1))
            let firstRowIndex = parseInt(key.slice(1))
            let opt = deepCal(lastColumnIndex, lastRowIndex, firstColumnIndex, firstRowIndex, obj)
            lastSelectArr = opt
            // console.log(opt)

            self.resetAreaStyle(opt)



            // console.log([firstPosLeft, firstPosTop], [lastPosLeft, lastPosTop])
            // console.log(firstPos, lastPos, e.target.dataset)
          }
        })
      },
      selectHandleCellMouseUp(e) {
        // console.log('selectHandleCellMouseUp')
        this.$nextTick(() => {
          if (p_isSelect) {
            p_isSelect = false
            moveOverMap = new Map()
          }
        })
      },
      resetAreaStyle(opt) {
        if (!firstPos) {
          return
        }
        let self = this
        let container = self.getContainer()
        let lastPosLeft = 0;
        let lastPosTop = 0;
        let firstPosLeft = 0;
        let firstPosTop = 0;
        firstPosLeft = firstPos.left;
        firstPosTop = firstPos.top;
        let target = container.querySelector(`.z-table-grid-editor__cell[data-key=${opt[0]}]`)
        if (target) {
          let pos =  self.$__selectGetPos(target);
          if (pos.lastLeft > lastPosLeft) {
            lastPosLeft = pos.lastLeft
          }
          if (pos.lastBottom > lastPosTop) {
            lastPosTop = pos.lastBottom
          }
        }

        let ftarget = container.querySelector(`.z-table-grid-editor__cell[data-key=${opt[1]}]`)

        if (ftarget) {
          let pos =  self.$__selectGetPos(ftarget);
          if (pos.left < firstPosLeft) {
            firstPosLeft = pos.left
          }
          if (pos.top < firstPosTop) {
            firstPosTop = pos.top
          }
        }

        let selWidth = lastPosLeft - firstPosLeft
        let selHeight = lastPosTop - firstPosTop


        // this.selectState.areaStyle.width = (lastPos.left - firstPos.left + lastPos.width) + 'px'
        // this.selectState.areaStyle.height = (lastPos.top - firstPos.top + lastPos.height) + 'px'

        this.selectState.areaStyle.left = firstPosLeft + 'px'
        this.selectState.areaStyle.top = firstPosTop + 'px'
        this.selectState.areaStyle.width = (selWidth) + 'px'
        this.selectState.areaStyle.height = (selHeight) + 'px'
      },
      selectHandleCellClick(e) {

        console.log(e.target.hasAttribute('data-grid-cell'))
        if (!e.target.hasAttribute('data-grid-cell')) {
          return
        }

        if (e.which < 2) {
          // this.isSelectRight = false
          p_isClick = true
          p_isSelect = true

          lastPos = null
          lastTarget = null
          firstPos = this.$__selectGetPos(e.target)
          firstTarget = e.target

          // console.log(rect)
          this.$__sizeAreaStyle(firstPos)
        }
        // right click
        else if (e.which === 3) {
          if (firstTarget) {
            if (lastTarget) {
              // console.log(firstTarget, lastTarget)
              this.selectState.areaRange = [
                firstTarget.dataset.key,
                lastTarget.dataset.key,
              ]
            } else {
              this.selectState.areaRange = [
                firstTarget.dataset.key,
                firstTarget.dataset.key,
              ]
            }
          }
          // this.isSelectRight = true
          let curPos = this.$__selectGetPos(e.target)
          if ( firstPos) {
            // console.log(curPos, lastPos, firstPos)
            if (lastPos) {
              if (curPos.left < lastPos.lastLeft && curPos.top < lastPos.lastBottom) {
                if (curPos.left >= firstPos.left && curPos.top >= firstPos.top) {
                  // console.log('in')

                  this.isSelectRight = true
                  return
                }
              }
            }
            else {
              // console.log(curPos, firstPos)
              if (curPos.left < firstPos.lastLeft && curPos.top < firstPos.lastBottom) {
                if (curPos.left >= firstPos.left && curPos.top >= firstPos.top) {
                  // console.log('in')
                  this.isSelectRight = true
                  return
                }
              }
            }
          }
          this.isSelectRight = false
        }


      },
      renderSelectArea() {



        let selectCls = ''
        if (this.$__selectCls) {
          selectCls = this.$__selectCls()
        }
        let selectState = this.selectState
        let selectArea = (<div class="z-table-grid__select-area"

                               id={selectState.areaId}
                               style={selectState.areaStyle}
        ></div>)


        return {
          selectCls,
          selectArea
        }
      }
    }
  }

}
